﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title></title>
        <link type="text/css" rel="stylesheet" media="all" href="../styles/global.css" />
        <link type="text/css" rel="stylesheet" media="all" href="../styles/global_color.css" /> 
    </head>
    <body  >
        <!--&lt;!&ndash;Logo区域开始&ndash;&gt;onload="initialYearAndMonth();"-->
        <div id="header">
            <img src="../images/logo.png" alt="logo" class="left"/>
            <a href="#">[退出]</a>            
        </div>
        <!--Logo区域结束-->
        <!--导航区域开始-->
        <div id="navi">                        
            <ul id="menu">
                <li><a href="../index.html" class="index_off"></a></li>
                <li id="lia1"><a href="rolelist" class="role_off"></a></li>
                <li id="lia2"><a href="adminlist" class="admin_off"></a></li>
                <li id="lia3"><a href="fee" class="fee_off"></a></li>
                <li id="lia4"><a href="accountlist" class="account_off"></a></li>
                <li id="lia5"><a href="servicelist" class="service_off"></a></li>
                <li id="lia6"><a href="bill" class="bill_on"></a></li>
                <li id="lia7"><a href="report" class="report_off"></a></li>
                <li><a href="userinfo" class="information_off"></a></li>
                <li><a href="changepsw" class="password_off"></a></li>
            </ul>            
        </div>
        <!--导航区域结束-->
        <!--主要区域开始-->
        <div id="main">
            <form action="" method="">
                <!--查询-->
                <div class="search_add">                        
                    <div>账务账号：<span class="readonly width70" id="zwzh"></span></div>
                    <div>身份证：<span class="readonly width150" id="idc"></span></div>
                    <div>姓名：<span class="readonly width70" id="name"></span></div>
                    <div>计费时间：<span class="readonly width70" id="time"></span></div>
                    <div>总费用：<span class="readonly width70" id="cost"></span></div>
                    <input type="button" value="返回" class="btn_add" onclick="location.href='blist';" />
                </div>  
                <!--数据区域：用表格展示数据-->     
                <div id="data">            
                    <table id="datalist">
                        <tr>
                            <th class="width70">账单明细ID</th>
                            <th class="width150">OS 账号</th>
                            <th class="width150">服务器 IP</th>
                            <th class="width70">账务账号ID</th>
                            <th class="width150">时长</th>
                            <th>费用</th>
                            <th class="width150">资费</th>
                            <th class="width50"></th>
                        </tr>
                    </table>
                </div>
                <!--分页-->
                <div id="pages">
                </div>                    
            </form>
        </div>
        <!--主要区域结束-->
        <div id="footer">
            <p>[源自北美的技术，最优秀的师资，最真实的企业环境，最适用的实战项目]</p>
            <p>版权所有(C)云科技有限公司 </p>
        </div>
    </body>
    <script src="../js/jquery-3.2.1.js"></script>
    <script language="javascript" type="text/javascript">
        urlinfo=window.location.href; //获取当前页面的url
        len=urlinfo.length;//获取url的长度
        offset=urlinfo.indexOf("?");//设置参数字符串开始的位置
        newsidinfo=urlinfo.substr(offset,len)//取出参数字符串 这里会获得类似“id=1”这样的字符串
        newsids=newsidinfo.split("=");//对获得的参数字符串按照“=”进行分割
        newsid=newsids[1];//得到参数值
        newsname=newsids[0];//得到参数名字
        $.ajax({
            url:"/billbyid?aid="+newsid,
            type:"post",
            success:function (result) {
                var acc = result;
                console.log(acc);
                $("#zwzh").text(acc.accountId);
                $("#idc").text(acc.idcardNo);
                $("#name").text(acc.realName);
                $("#time").text(acc.createDate);
                $("#cost").text("待计算");
                $.ajax({
                    url:"/serbyaid?aid="+newsid,
                    type:"post",
                    success:function (result) {
                        for (var i in result) {
                            var acc = result[i];
                            console.log(acc);
                            addNewTR(acc, i);
                        }
                    }
                })
            }
        })
        function addNewTR(acc, i) {
            var j = parseInt(i) + 1;
            var tr = $("<tr><td>" + acc.serviceId + "</td><td>" + acc.osUsername + "</td><td>" + acc.unixHost + "</td><td>" +
                    acc.accountId + "</td><td>" + 10 + "</td><td>" + '待计算' + "</td><td>" +
                    '待计算' + "</td><td>" +
                    "<a href=/bdetail?aid="+acc.serviceId+" title=详单>" + '详单' + "</a></td></tr>")
            var tab = $("#datalist");
            tab.append(tr);
        }
//
//        $.ajax({
//            url: "accountpage",
//            type: "type",
//            success: function (result) {
//                var roleList = result.list;
//                var pages = result.pages;
//                var pageNum = result.pageNum;
//                var isFirstPage = result.isFirstPage;
//                var isLastPage = result.isLastPage;
//                for (var i in roleList) {
//                    var role = roleList[i];
//                    addNewTR(role);
//                }
//                $("#pages").append("<a id='up'>上一页</a>")
//
//                for (var i = 1; i < pages+1; i++) {
//                    if (i == pageNum) {
//                        $("#pages").append("<a id=" + i + "; class=current_page; onclick='changePage(" + i + ")'>" + i + "</a>")
//                    } else {
//                        $("#pages").append("<a id=" + i + "; onclick='changePage(" + i + ")'>" + i + "</a>")
//                    }
//                }
//                $("#pages").append("<a id='down'>下一页</a>")
//                if (!isFirstPage) {
//                    var num = pageNum - 1;
//                    $("#up").attr("onclick", "changePage(" + num + ")");
//                }
//                if (!isLastPage) {
//                    var num = pageNum + 1;
//                    $("#down").attr("onclick", "changePage(" + num + ")");
//                }
//            }
//        })
//
//
//        function changePage(pagenum) {
//
//            $.ajax({
//                url: "accountpage",
//                type: "post",
//                data: {
//                    pagenum: pagenum,
//                },
//                success: function (result) {
//                    $("#accountlist").empty();
//                    $("#pages").empty();
//                    var roleList = result.list;
//                    var pages = result.pages;
//                    var pageNum = result.pageNum;
//                    var isFirstPage = result.isFirstPage;
//                    var isLastPage = result.isLastPage;
//                    for (var i in roleList) {
//                        var role = roleList[i];
//                        addNewTR(role);
//                    }
//                    $("#pages").append("<a id='up'>上一页</a>")
//                    if (!isFirstPage) {
//                        var num = pageNum - 1;
//                        $("#up").attr("onclick", "changePage(" + num + ")");
//                    }
//                    for (var i = 1; i < pages+1; i++) {
//                        if (i == pageNum) {
//                            $("#pages").append("<a id=" + i + "; class=current_page; onclick='changePage(" + i + ")'>" + i + "</a>")
//                        } else {
//                            $("#pages").append("<a id=" + i + "; onclick='changePage(" + i + ")'>" + i + "</a>")
//                        }
//                    }
//                    $("#pages").append("<a id='down'>下一页</a>")
//                    if (!isLastPage) {
//                        var num = pageNum + 1;
//                        $("#down").attr("onclick", "changePage(" + num + ")");
//                    }
//                }
//            })
//        }

    </script>
</html>
